//财务管理-2差异明细-2查看处理状态
import '../Finance.css'
import { NavLink , useSearchParams } from 'react-router-dom'
import { Table , Input , Space , Image , Button } from '@arco-design/web-react';
const TextArea = Input.TextArea;
const columns = [{
  title: '交易完成时间',
  dataIndex: 'time',
  key:'time'
},
{
  title: '对账类型',
  dataIndex: 'type1',
  key:'type1'
},
{
  title: '交易类型',
  dataIndex: 'type2',
  key:'type2'
},
{
  title: '差错类型',
  key:'type3',
  render:  (_, record) =>{
    return <span className='green'>{record.type3}</span>
  }
},
{
  title: (<span>支付订单号<br/>商户订单号</span>),
  key:'id',
  render: (_, record) => (
    <span className='green'>
      <div>{record.id[0]}</div>
      <div>{record.id[1]}</div>
    </span>
  )
},
{
  title: (<span>支付订单金额<br/>商户订单金额</span>),
  key:'money',
  render: (_, record) => (
    <span className='green'>
      <div>{record.money[0]}</div>
      <div>{record.money[1]}</div>
    </span>
  )
},
{
  title: '处理状态',
  key:'state',
  render: (_,record) => (<span className='green'>{record.state?'已处理':'未处理'}</span>),
}];
const data = [{
  time: '2019-12-01',
  type1: '支付宝',
  type2: '消费',
  type3:'支付宝单边',
  id:['PAY2938475628374625','123456789'],
  money:['35.00 元','35.00 元'],
  state:1
}];

const Result = () => {
  const [search,setSearch]=useSearchParams();
  console.log(search.get('batchNumber'),'跳转获取值');

  return (
    <div className='bigBox'>
      <div className='title'>
        <div>
          <span>财务管理</span>
          <span>  /  </span>
          <span>差异明细</span>
          <span>  /  </span>
          <span className='bold'>查看处理状态</span>
        </div>
        <h2>查看处理状态</h2>
      </div>
      <div className='content'>
        <div>
          <div className='c_msg'>
            <Table columns={columns} data={data} pagination={false}  rowKey='id'/>
          </div>
          <div className='c_table' style={{ maxWidth: 650 }}>
            <div>
              <span>处理原因反馈：</span>
              <Space wrap>
                <TextArea defaultValue='因支付宝系统宕机触先交易异常，导致订单信息未能实时获取，经过数据对比，寻找到该订单，已完成人工处理，并进行正常对账处理' style={{ minHeight: 70, width: 460 }} disabled />
              </Space>
            </div>
            <div className='imgBox'>
              <div>附件凭证：</div>
              <div>
                <div>凭证001.jpg</div>
                <Image
                    width={200}
                    src='//p1-arco.byteimg.com/tos-cn-i-uwbnlip3yd/a8c8cdb109cb051163646151a4a5083b.png~tplv-uwbnlip3yd-webp.webp'
                    alt='lamp'
                  />
              </div>
              <div>
                <div>凭证002.jpg</div>
                <Image
                    width={200}
                    src='//p1-arco.byteimg.com/tos-cn-i-uwbnlip3yd/a8c8cdb109cb051163646151a4a5083b.png~tplv-uwbnlip3yd-webp.webp'
                    alt='lamp'
                  />
              </div>
            </div>
          </div>
        </div>
        <NavLink to='/home/finance/deta'><Button type='outline' status='warning'>返回</Button></NavLink>
      </div>
    </div>
  )
}
export default Result

